<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width,user-scalable=no, initial-scale=1">
		<title>CRM</title>
		<link rel="stylesheet" type="text/css" href="/azxcrm/css/wap/mui.min.css" th:href="@{/azxcrm/css/wap/mui.min.css}"/>
		<link rel="stylesheet" type="text/css" href="/azxcrm/css/wap/mui.picker.min.css" th:href="@{/azxcrm/css/wap/mui.picker.min.css}"/>
		<link rel="stylesheet" type="text/css" href="/azxcrm/css/wap/aui.css" th:href="@{/azxcrm/css/wap/aui.css}"/>
		<link rel="stylesheet" type="text/css" href="/azxcrm/css/wap/new_order.css" th:href="@{/azxcrm/css/wap/new_order.css}"/>
		<link rel="stylesheet" type="text/css" href="//at.alicdn.com/t/font_835360_8flqp9ignrc.css"/>
		<script src="/azxcrm/js/wap/mui.min.js" th:src="@{/azxcrm/js/wap/mui.min.js}" type="text/javascript" charset="utf-8"></script>
		<script src="/azxcrm/js/wap/mui.picker.min.js" th:src="@{/azxcrm/js/wap/mui.picker.min.js}" type="text/javascript" charset="utf-8"></script>
		<script src="/azxcrm/js/wap/city.data-3.js" th:src="@{/azxcrm/js/wap/city.data-3.js}" type="text/javascript" charset="utf-8"></script>
		<script src="../static/js/jquery.min.js" th:src="@{/js/jquery.min.js}"></script>
		<script th:inline="javascript"> var ctx = [[@{/}]]; </script>
	</head>
	<body>
		<header class="aui-bar aui-bar-nav">
			 <a href="javascript:history.back(-1)"  class="aui-pull-left aui-btn">
	       		 <span class="iconfont icon-fanhui1">返回</span>
	    	</a>
		    <div class="aui-title">创建订单</div>
		</header>
		<form id="add_order">
			<section class="aui-grid aui-margin-b-15">			
				<div class="aui-content aui-margin-b-15">
				    <ul class="aui-list aui-list-in">
				        <li class="aui-list-header">
				        	<h3><img src="../../azxcrm/image/wap/customer.png">客户信息</h3>
				        </li>
				        <li class="aui-list-item">
				            <div class="aui-list-item-inner">
				            	<div class="clearfix">
				            		<div class="aui-list-item-title">客户姓名：</div>	
				                	<div class="aui-text" th:text="${clue.customerName}"></div>
				            	</div>			                
				            </div>
				        </li>
				        <li class="aui-list-item">
				            <div class="aui-list-item-inner">
				            	<div class="clearfix">
					                <div class="aui-list-item-title">手机号码：</div>
					                <div class="aui-text" th:text="${clue.customerCellphone}"></div>
					            </div>    
				            </div>
				        </li>	
				         <li class="aui-list-item">
				            <div class="aui-list-item-inner">
				            	<div class="clearfix">
					                <div class="aui-list-item-title">身份证号：</div>
					                <div class="aui-text" th:text="${clue.customerIdentityNum}"></div>
					            </div>    
				            </div>
				        </li>	
				    </ul>
				</div>
				<div class="aui-content aui-margin-b-15">
				    <ul class="aui-list aui-list-in" id="parent">
				        <li class="aui-list-header">
				        	<h3><img src="../../azxcrm/image/wap/saler_product.png">销售产品</h3>
				        </li>
						<li class="aui-list-item" id="child">
			                <div class="aui-list-item-inner g-center">
			                    <div class="aui-list-item-input icon--jia iconfont" id="add">添加产品信息</div>			                   
			                </div>
			            </li>	
				    </ul>
				     <ul class="aui-list aui-form-list" id="list"></ul>
				</div>
				<footer class="aui-bar aui-bar-tab" id="footer">
						 <input type="hidden" name="typeId" id="typeId">
	                     <input type="hidden" name="typeName" id="typeName" >
	                     <input type="hidden" name="productId" id="productId" >
	                     <input type="hidden" name="fullName" id="fullName" >
						 <input type="hidden" id="clueId" name="clueId" th:value="${clue.clueId}">
                         <input type="hidden" id="status" name="status" th:value="${status}">					
				       <button type="button" class="aui-bar aui-bar-tab" id="toastBtn" onclick="return check(this.form)">确认添加 </button> 
			   </footer>
			</section>
		</form>
	</body>
</html>
<script>
		var getOrderType,getProduct,getProductInfo;  /* 定义三个全局变量用于接受数据 */  
		var add = document.getElementById('add');	
		var list = document.getElementById("list");
		var parent =  document.getElementById("parent");
		var child = document.getElementById("child");
		var clueId = document.getElementById("clueId").value;
		var status=document.getElementById("status").value;
		var picker = new mui.PopPicker({
		    layer: 3
		});		
		add.addEventListener('tap', function() {			
			$.ajax({
				cache : true,
				type : "get",
				url : ctx + "/wap/customer/getOrderType",
				data :'',
				async : false,
				error : function(res) {					
					mui.toast("系统错误");
					return false;
				},
				success : function(data) {	
					getOrderType = data;				
					$.ajax({
						cache : true,
						type : "get",
						url : ctx + "/wap/customer/getProductSpecification",
						data :'',
						async : false,
						error : function(res) {
							mui.toast("系统错误");
							return false;
						},
						success : function(data) {	
							getProduct = data;								
							$.ajax({
								cache : true,
								type : "get",
								url : ctx + "/wap/customer/getProductInfo",
								data :'',
								async : false,
								error : function(res) {
									mui.toast("系统错误");
									return false;
								},
								success : function(data) {	
									getProductInfo = data;		
								
								}
							});														
						}
					});								
				}
			});
			
			
			picker.setData(getSelectData(getOrderType,getProduct,getProductInfo));
			picker.show(function(items) {
			 	parent.removeChild(child);			
			 	document.getElementById('typeId').value = items[0].value;
			 	document.getElementById('typeName').value = items[0].text;
			 	document.getElementById('productId').value = items[2].value; 
			 	document.getElementById('fullName').value = items[2].fullName;
			 	var data = items[0].text+'-'+items[1].text+'-'+items[2].text;	
			 	
			 	var money = items[2].money;
			 	var month = items[2].month;			 
				var product = "<li class='aui-list-item'><div class='aui-list-item-inner'><div class='clearfix g-div'><div class='aui-list-item-title' style='width:24%;text-align: right;'>销售产品：</div><div class='aui-text aui-jy'>"+data+"</div></div></li>"+
							  "<li class='aui-list-item'><div class='aui-list-item-inner'><div class='clearfix'><div class='aui-list-item-title'>金额(￥)：</div><div class='aui-text'>"+money+"</div></div></li>"+
							  "<li class='aui-list-item'><div class='aui-list-item-inner'><div class='clearfix'><div class='aui-list-item-title'>使用期限：</div><div class='aui-text'>"+month+"</div></div></li>"			
				list.innerHTML=product;				
			}) 
			
			})
		
		function check(form) {
       	   if(form.typeName.value==''){
               mui.toast('产品信息必选');
                 return false;
              }else{
            	$.ajax({
         		cache : true,
         		type : "POST",
         		url : ctx + "/wap/customer/saveOrder",
         		data : $("#add_order").serialize(),
         		async : false,
         		error : function(request) {
         			mui.toast("系统错误");
         		},
         		success : function(data) {
         			if (data.code == 0) {
         				mui.toast("添加成功"); 
         				$("#toastBtn").removeAttr("onclick");
         				setTimeout(function(){
       		    	    	window.location.href= ctx + "wap/customer/customerInfo?clueId=" + clueId+"&status=" + status
        		    	    },2200)
         			} else {
         				mui.toast("添加失败");
         			}
         		}
         		});
             }     
       }
		function getSelectData(data1,data2,data3){
			var arr1 = {},arr2 = {},arr3 = {};
			//一级数据
			for (var i=0;i<data1.length;i++) {
				arr1[data1[i].dictCode] = {
					text:data1[i].dictLabel,
					value:data1[i].dictCode,					
					children:{},
					_index:i,
				}
			}
			for (var j=0;j<data2.length;j++) {
				arr1[data2[j].typeId].children[data2[j].specId]={
					text:data2[j].specName,
					value:data2[j].specId,
					children:[]
				}			
			}
			
			for (var k=0;k<data3.length;k++) {
				arr1[data3[k].typeId].children[data3[k].specId].children.push({
					text:data3[k].productName,
					value:data3[k].productId,
					money:data3[k].productPrice,
					month:data3[k].productTerm,
					fullName:data3[k].fullName
				})
			}
			
			var arr2=[],o1,o2;
			for(o1 in arr1){
				arr2.push({
					text:arr1[o1].text,
					value:arr1[o1].value,
					children:[]
				})
				for(o2 in arr1[o1].children){
					arr2[arr1[o1]._index].children.push(arr1[o1].children[o2])
				}
			}
			
			return arr2
		}
		
		

</script>
